<template>
    <div class="container_box">
        <el-scrollbar class="main_box">
            <div class="newCommonList">
                <el-form :model="form" label-width="auto">
                    <el-row>
                        <el-col :span="12"
                            ><el-form-item label="公海名称" required>
                                <el-input
                                    v-model="form.name"
                                    maxlength="15"
                                    show-word-limit
                                    type="text"
                                    placeholder="请输入公海名称"
                                    :disabled="
                                        isread || router.currentRoute.value.query.index == 0
                                    "></el-input> </el-form-item
                        ></el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="20"
                            ><el-form-item label="公海管理员" prop="emplou" required>
                                <div v-if="!isread" class="staffs">
                                    <el-tag
                                        v-for="item in creators"
                                        :key="item.name"
                                        class="staffs_item"
                                        type="warning"
                                        closable
                                        @close="handleClose(item, 1)">
                                        {{ item.name }}
                                    </el-tag>
                                </div>
                                <div v-if="isread" class="staffs">
                                    <el-tag
                                        v-for="item in creators"
                                        :key="item.name"
                                        class="staffs_item"
                                        type="warning"
                                        :closable="false">
                                        {{ item.name }}
                                    </el-tag>
                                </div>
                                <el-button v-if="!isread" @click="openDepart(1)">选择员工</el-button></el-form-item
                            ></el-col
                        >
                    </el-row>
                    <el-row>
                        <el-col :span="20">
                            <el-form-item label="可见部门" prop="dept" required>
                                <div v-if="isread || router.currentRoute.value.query.index == 0" class="staffs">
                                    <el-tag
                                        v-for="item in deptData"
                                        :key="item.name"
                                        class="staffs_item"
                                        type="warning"
                                        :closable="false">
                                        {{ item.name }}
                                    </el-tag>
                                </div>
                                <div v-else class="staffs">
                                    <el-tag
                                        v-for="item in deptData"
                                        :key="item.name"
                                        class="staffs_item"
                                        type="warning"
                                        closable
                                        @close="closedept(item)">
                                        {{ item.name }}
                                    </el-tag>
                                </div>
                                <el-button v-if="!isread && router.currentRoute.value.query.index != 0" @click="open"
                                    >选择部门</el-button
                                >
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="20">
                            <el-form-item label="分配方式">
                                <el-radio-group v-model="form.apply_rule_type" :disabled="isread">
                                    <el-radio :label="1">手动领取</el-radio>
                                    <el-radio :label="2">自动分配</el-radio>
                                    <el-radio :label="3">公海管理员分配</el-radio>
                                </el-radio-group>
                                <div v-show="form.apply_rule_type == 2">
                                    <el-radio-group v-model="form.auto_apply_type" :disabled="isread">
                                        <el-radio :label="1">随机分配</el-radio>
                                        <el-radio :label="2">平均分配</el-radio>
                                    </el-radio-group>
                                </div>
                                <div v-show="form.apply_rule_type == 1">
                                    <el-radio-group v-model="form.is_limit" :disabled="isread"
                                        >fa
                                        <el-radio :label="1">不限</el-radio>
                                        <el-radio :label="2">限制</el-radio>
                                    </el-radio-group>
                                </div>
                                <div v-show="form.apply_rule_type == 1 && form.is_limit == 2">
                                    <el-form-item label="每日领取数量" class="space">
                                        <el-input
                                            v-model.number="form.receive_qty.per_day"
                                            :disabled="isread"
                                            @change="inputchange(form.receive_qty.per_day, 1)"></el-input
                                    ></el-form-item>
                                    <el-form-item label="每月领取数量" class="space">
                                        <el-input
                                            v-model.number="form.receive_qty.per_month"
                                            :disabled="isread"
                                            @change="inputchange(form.receive_qty.per_month, 2)"></el-input
                                    ></el-form-item>
                                    <el-form-item label="总领取数量" class="space">
                                        <el-input
                                            v-model.number="form.receive_qty.total"
                                            :disabled="isread"
                                            @change="inputchange(form.receive_qty.total, 3)"></el-input>
                                    </el-form-item>
                                </div>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="20"
                            ><el-form-item label="回收方式">
                                <el-radio-group v-model="form.is_recovery" :disabled="isread">
                                    <el-radio :label="1">不回收</el-radio>
                                    <el-radio :label="2">自定义回收</el-radio>
                                </el-radio-group>

                                <div v-show="form.is_recovery == 2" class="transcontent">
                                    <div class="ruleText">至公海</div>
                                    <div>
                                        <el-radio-group
                                            v-model="form.recovery_seas_type"
                                            :disabled="isread"
                                            @change="changeClub">
                                            <el-radio :label="1">当前公海</el-radio>
                                            <el-radio :label="2">其他公海</el-radio> </el-radio-group
                                        >&nbsp;<el-select
                                            v-model="form.recovery_seas_ids"
                                            :disabled="isread"
                                            placeholder="请选择公海"
                                            ><el-option
                                                v-for="item in seaids"
                                                :key="item.id"
                                                :value="item.id"
                                                :label="item.name"
                                                >{{ item.name }}</el-option
                                            ></el-select
                                        >
                                    </div>
                                </div>
                                <div v-show="form.is_recovery == 2" class="transcontent">
                                    <div class="ruleText">回收规则</div>
                                    <div class="transRight">
                                        <div v-show="form.recovery_rule.length" class="transrule">
                                            <div
                                                v-for="(item, index) in form.recovery_rule"
                                                :key="index"
                                                class="transcolumn">
                                                <div class="transall">
                                                    <div class="left"><div class="circle"></div></div>
                                                    <div class="right transall">
                                                        <span>规则{{ index + 1 }}：超过&nbsp;</span
                                                        ><el-input-number
                                                            v-model="item.beyond_days"
                                                            :min="0"
                                                            :step="1"
                                                            size="small"
                                                            style="width: 100px"
                                                            :disabled="isread"></el-input-number
                                                        ><span>&nbsp;天&nbsp;</span
                                                        ><el-input-number
                                                            v-model="item.beyond_hours"
                                                            :min="0"
                                                            :max="23"
                                                            :step="1"
                                                            size="small"
                                                            style="width: 100px"
                                                            :disabled="isread"></el-input-number
                                                        ><span>&nbsp;时，未执行&nbsp;</span
                                                        ><el-select
                                                            v-model="item.not_do_type"
                                                            placeholder="请选择有效行为"
                                                            style="width: 140px"
                                                            :disabled="isread">
                                                            <el-option label="添加跟进记录" :value="2"></el-option>
                                                            <el-option
                                                                label="编辑客户信息"
                                                                :value="1"></el-option> </el-select
                                                        ><span>&nbsp;</span
                                                        ><img
                                                            v-if="!isread"
                                                            src="@/assets/delete.png"
                                                            class="tramsimg"
                                                            @click="deleteRule(index)" />
                                                    </div>
                                                </div>
                                                <div v-if="form.recovery_rule.length !== index + 1" class="center">
                                                    <div class="line"></div>
                                                    <span class="text">或</span>
                                                    <div class="line"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <el-button v-if="!isread" @click="addtransrule">添加规则</el-button>
                                    </div>
                                </div>
                                <div v-show="form.is_recovery == 2">
                                    <div class="transcontent">
                                        <div class="ruleText">执行对象</div>
                                        <div>
                                            <el-radio-group v-model="form.recovery_type" :disabled="isread">
                                                <el-radio :label="1">公海员工统一执行</el-radio>
                                                <el-radio :label="2">指定员工执行</el-radio>
                                            </el-radio-group>
                                            <div v-show="form.recovery_type == 2" class="staffs">
                                                <template v-if="!isread">
                                                    <el-tag
                                                        v-for="item in twocreators"
                                                        :key="item.name"
                                                        class="staffs_item"
                                                        closable
                                                        :type="item.id"
                                                        @close="handleClose(item, 2)">
                                                        {{ item.name }}
                                                    </el-tag> </template
                                                ><template v-if="isread">
                                                    <el-tag
                                                        v-for="item in twocreators"
                                                        :key="item.name"
                                                        class="staffs_item"
                                                        :closable="false"
                                                        :type="item.id">
                                                        {{ item.name }}
                                                    </el-tag>
                                                </template>
                                            </div>
                                            <template v-if="!isread"
                                                ><el-button
                                                    v-show="form.recovery_type == 2"
                                                    v-if="!isread"
                                                    size="small"
                                                    @click="openDepart(2)"
                                                    >选择员工</el-button
                                                ></template
                                            >
                                        </div>
                                    </div>
                                    <!-- <div v-show="form.recovery_remind" style="color: #606266"
                >回收前&nbsp;<el-input v-model="form.recovery_remind_before" style="width: 100px" :disabled="isread"></el-input>&nbsp;天&nbsp;<el-time-picker
                  v-model="form.recovery_remind_before_time"
                  value-format="HH:mm:ss"
                  placeholder="选择时间"
                  :disabled="isread"
                />&nbsp;提醒员工</div
              > -->
                                </div>
                                <div v-show="form.is_recovery == 2">
                                    <div class="transcontent">
                                        <div class="ruleText">回收提醒</div>
                                        <div>
                                            <el-switch v-model="form.recovery_remind" :disabled="isread"></el-switch>
                                            <div v-show="form.recovery_remind" style="color: #606266">
                                                回收前&nbsp;
                                                <el-input-number
                                                    v-model.number="form.recovery_remind_before"
                                                    :min="0"
                                                    :step="1"
                                                    size="small"
                                                    style="width: 100px"
                                                    :disabled="isread"
                                                    @change="
                                                        inputchange(form.recovery_remind_before, 4)
                                                    "></el-input-number>
                                                &nbsp;天&nbsp;
                                                <el-time-picker
                                                    v-model="form.recovery_remind_before_time"
                                                    value-format="HH:mm"
                                                    placeholder="选择时间"
                                                    :disabled="isread" />
                                                &nbsp;提醒员工
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </el-form-item></el-col
                        >
                    </el-row>
                    <!-- <el-row v-show="form.is_recovery == 2"> -->
                    <el-row>
                        <el-col :span="20"
                            ><el-form-item label="员工回捡">
                                <el-switch v-model="form.staff_check" :disabled="isread"></el-switch>
                                <div v-show="form.staff_check" style="color: #606266">
                                    退回&nbsp;<el-input-number
                                        v-model.number="form.staff_check_delay"
                                        :min="0"
                                        :step="1"
                                        size="small"
                                        style="width: 100px"
                                        :disabled="isread"
                                        @change="inputchange(form.staff_check_delay, 5)"></el-input-number
                                    >&nbsp;天后，才可以重新认领
                                </div>
                            </el-form-item></el-col
                        >
                    </el-row>
                </el-form>

                <!--选择部门弹出框-->
                <el-dialog v-model="departVisible" title="选择部门" width="700px" custom-class="dialogClass">
                    <div class="depart-content">
                        <div class="depart_l">
                            <el-input
                                v-model="companySearch"
                                class="search"
                                suffix-icon="Search"
                                placeholder="搜索部门"
                                @input="searchName"></el-input>
                            <el-scrollbar v-if="!companySearch" height="420px">
                                <el-tree
                                    default-expand-all
                                    :data="treeData"
                                    :props="defaultProps"
                                    @node-click="nodeClick">
                                    <template #default="{ node, data }">
                                        <span>{{ node.name }}</span>
                                        <div class="hover-detail">
                                            {{ data.name
                                            }}<span :class="data.is_local ? 'local-color' : 'detail-color'">{{
                                                data.is_local ? '(本地)' : '(企微)'
                                            }}</span>
                                        </div>
                                    </template>
                                </el-tree>
                            </el-scrollbar>
                            <div v-if="dataTree.length > 0" class="depart-detail">
                                <el-button
                                    v-for="(item, index) in dataTree"
                                    :key="index"
                                    class="search-detail"
                                    type="text"
                                    @click="clickSearch(item)"
                                    >{{ item.name
                                    }}<span :class="item.is_local ? 'local-color' : 'detail-color'">{{
                                        item.is_local ? '(本地)' : '(企微)'
                                    }}</span>
                                </el-button>
                            </div>
                            <div v-if="dataTree.length == 0 && companySearch" class="no-data">
                                <div class="no-img">
                                    <span class="no_data_text">暂无数据</span>
                                </div>
                            </div>
                        </div>

                        <!-- <div class="depart_r">
          <div class="title">已选择的部门：</div>
          <div class="select-detail select-details" v-if="dialogMember?.length" v-for="(item, index) in dialogMember" :key="index">
            <div>{{ item.name }}</div>
            <el-icon class="deleteIcon" v-show="item.name" @click="deldelectDeparts(item)" style="font-size: 25px">
              <circle-close />
            </el-icon>
          </div>
        </div> -->

                        <div class="depart_r">
                            <div class="depart_select_title">已选择的部门</div>
                            <el-scrollbar height="380px">
                                <template v-if="dialogMember?.length">
                                    <div v-for="item in dialogMember" :key="item.id" class="seled_member">
                                        <div class="item_member">
                                            <el-icon class="seled_icon">
                                                <user-filled />
                                            </el-icon>
                                            <span class="member_name">{{ item.name }}</span>
                                        </div>
                                        <el-icon class="remove_icon" @click="deldelectDeparts(item)">
                                            <close />
                                        </el-icon>
                                    </div>
                                </template>
                            </el-scrollbar>
                        </div>
                    </div>
                    <template #footer>
                        <span class="dialog-footer">
                            <el-button @click="cancelDep">取消</el-button>
                            <el-button type="primary" @click="depConfirmed">确定</el-button>
                        </span>
                    </template>
                </el-dialog>
                <ZWDepart ref="DepartRef" type="1" @submit="getDepart" />
            </div>
        </el-scrollbar>
        <div class="footer_box">
            <el-button @click="router.go(-1)">取消</el-button
            ><el-button v-if="!isread" type="primary" @click="save">保存</el-button>
        </div>
    </div>
</template>

<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { ElMessage } from 'element-plus';
import router from '@/router';
import ZWDepart from '@/components/ZWDepart.vue';
import { getSetionId } from '@/utils/utils';
import { getClubSetting, newSea, seaDetail } from '@/api/customer/clubManage/commonSea';
import { searchTreeList } from '@/api/employee';

import { seaList, addCustomerSea, editCustomerSea, checkCustomerSeaDetail } from '@/api/customerCenter/customerSea';

import { fetchTreeList } from '@/api/employe/employeemanage/manage';

// import { deepClone } from "@/utils/utils";

import lodash from 'lodash';

const isread = router.currentRoute.value.query.text ? true : false;
const deptType = ref(1); //1是管理员员工弹框 2是回收方式指定员工弹框
const form = reactive({
    name: '', //公海名称
    admin_ids: [], //管理id数组
    dept_ids: [], //可见部门id数组
    apply_rule_type: 1, //分配规则类型 1手动领取。2自动分配 3管理员分配
    is_limit: 1, //是否限制领取数
    auto_apply_type: 1,
    receive_qty: {
        per_day: '', //每天限制
        per_month: '', //每月限制
        total: '' //总限制
    }, //领取限制
    recovery_type: 1, //回收规则 2制定员工 1公海统一回收
    is_recovery: 1, //是否回收  1 不回收 2自定义回收
    recovery_ids: [], //指定定员工
    recovery_seas_type: 1, //1 当前公海  2指定公海
    recovery_seas_id: '', //回收公海id
    recovery_seas_ids: '',
    recovery_rule: [], //回收规则
    staff_check: false, //员工回捡开关 1 开启 2关闭
    staff_check_delay: '', //员工回捡相隔天数
    recovery_remind: false, //回收提醒开关
    recovery_remind_before: '', //回收前多少天提醒
    recovery_remind_before_time: '',
    // transfer_type: 1, //转化类型 1手动2自动
    transfer_condition: [], //转化条件
    cycle_type: 1, //转化周期
    behavior_contact: [], //行为触点
    cycle_config: {
        cycle_days: '', //天数
        time: '' //时间
    } //转化配
});
const twocreators = ref([]);
const creators = ref<any>([]);
const deptData = ref([]); //选择的部门列表
const DepartRef = ref(null);
const departVisible = ref(null);
const companySearch = ref();
const department_id = ref([]);
const dialogMember = ref([]);
const treeData = ref([]);
const dataTree = ref([]);
const selectId = ref(0);
const seaids = ref([]); //公海列表
const setingid = ref([]); //线索属性列表
const inputchange = (val: number, num: any) => {
    // var req = /^[1-9]*[1-9][1-9]*$/
    const req = /^[0-9]+$/;
    if (!req.test(val)) {
        ElMessage.warning('请输入正整数');
        if (num == 1) {
            form.receive_qty.per_day = '';
        } else if (num == 2) {
            form.receive_qty.per_month = '';
        } else if (num == 3) {
            form.receive_qty.total = '';
        } else if (num == 4) {
            form.recovery_remind_before = '';
        } else if (num == 5) {
            form.staff_check_delay = '';
        } else {
            form.cycle_config.cycle_days = '';
        }
    } else {
        if (num == 1) {
            if (form.receive_qty.per_month && Number(form.receive_qty.per_month) < Number(form.receive_qty.per_day)) {
                form.receive_qty.per_day = '';
                ElMessage.warning('每日领取数量要不能大于每月领取数量');
            }
        } else if (num == 2) {
            if (form.receive_qty.per_day && Number(form.receive_qty.per_day) > Number(form.receive_qty.per_month)) {
                form.receive_qty.per_month = '';
                ElMessage.warning('每月领取数量要不能小于每日领取数量');
            }
        } else if (num == 3) {
            if (form.receive_qty.per_day && Number(form.receive_qty.per_day) > Number(form.receive_qty.total)) {
                form.receive_qty.total = '';
                ElMessage.warning('总领取数量要不能小于每日领取数量');
            }
            if (form.receive_qty.per_month && Number(form.receive_qty.per_month) > Number(form.receive_qty.total)) {
                form.receive_qty.total = '';
                ElMessage.warning('总领取数量要不能小于每月领取数量');
            }
        }
    }
};
//获取公海列表
const getSeaList = () => {
    seaList({ page: 1, page_size: 99 }).then((res: any) => {
        seaids.value = res.data;
    });
};
//获取线索属性
const getclub = () => {
    getClubSetting({ page: 1, page_size: 99 }).then((res: any) => {
        res.data.forEach(item => {
            if (item.is_enable == 1) {
                setingid.value.push(item);
            }
        });
    });
};

//获取 公海数据详情
const getSeaDetail = () => {
    if (router.currentRoute.value.query.id) {
        checkCustomerSeaDetail({ id: router.currentRoute.value.query.id }).then(res => {
            creators.value = res.admin_ids;
            deptData.value = res.dept_ids;
            twocreators.value = res.recovery_ids;
            res.dept_ids = getSetionId('id', res.dept_ids);
            res.admin_ids = getSetionId('id', res.admin_ids);
            res.recovery_ids = getSetionId('id', res.recovery_ids);
            res.recovery_remind = res.recovery_remind == 1 ? true : false;
            res.staff_check = res.staff_check == 1 ? true : false;
            Object.assign(form, res);
            if (form.apply_rule_type == 1) {
                form.auto_apply_type = 1;
            } else if (form.apply_rule_type == 2) {
                form.is_limit = 1;
            }
            if (form.is_recovery == 2) {
                if (form.recovery_seas_id == 0) {
                    form.recovery_seas_type = 1;
                    form.recovery_seas_ids = '';
                } else {
                    form.recovery_seas_type = 2;
                    form.recovery_seas_ids = form.recovery_seas_id;
                }
                // form.recovery_type = 1
            }
        });
    }
};
getSeaDetail();
getclub();
getSeaList();
//获取部门树
const getTreeList = () => {
    treeData.value = [];
    fetchTreeList().then((data: any) => {
        treeData.value.push(data as never);
    });
};
getTreeList();
const openDepart = (data: any) => {
    // 记录是那个员工弹框
    deptType.value = data;
    DepartRef.value.departVisble = true;
    DepartRef.value.selectedMember = data == 1 ? [...creators.value] : [...twocreators.value];
};
const open = () => {
    departVisible.value = true;
    dialogMember.value = JSON.parse(JSON.stringify(deptData.value));
};
// 获取部门成员
const getDepart = (res: any) => {
    if (deptType.value == 1) {
        creators.value = res;
        form.admin_ids = getSetionId('id', creators.value);
    } else {
        twocreators.value = res;
        form.recovery_ids = getSetionId('id', twocreators.value);
    }
};
// 员工移除
const handleClose = (data: any, deptType: number) => {
    if (deptType == 1) {
        creators.value = creators.value.filter((item: any) => item.id !== data.id);
        form.admin_ids = getSetionId('id', creators.value);
    } else {
        twocreators.value = twocreators.value.filter((item: any) => item.id !== data.id);
        form.recovery_ids = getSetionId('id', twocreators.value);
    }
    DepartRef.value.removeItem(data);
};
//选择部门节点-负责部门
const nodeClick = (data: any) => {
    !dialogMember.value.some(item => item.id == data.id) && dialogMember.value.push(data);
    selectId.value = data.id;
    form.department_id = data.id;
};
//部门选择确定
const depConfirmed = () => {
    deptData.value = dialogMember.value;
    form.dept_ids = getSetionId('id', dialogMember.value);
    departVisible.value = false;
};
//部门选择取消
const cancelDep = () => {
    departVisible.value = false;
};
//删除所选部门节点
const deldelectDeparts = (val: any) => {
    dialogMember.value.forEach((item: any, index: any) => {
        if (item.name == val.name) {
            dialogMember.value.splice(index, 1);
        }
    });
};
const closedept = (data: any) => {
    deptData.value = deptData.value?.filter((item: any) => item.id != data.id);
    form.dept_ids = getSetionId('id', deptData.value);

    // DepartRef.value.removeItem(data)
};
//添加转化规则条件
const addrule = () => {
    form.transfer_condition.push({
        clue_attr_id: '' //线索属性id
    });
};
// 删除转化规则条件
const deleteRecycleRule = (data: any) => {
    form.transfer_condition.splice(data, 1);
};
//删除回收规则条件
const deleteRule = (data: any) => {
    form.recovery_rule.splice(data, 1);
};
// 添加回收规则条件
const addtransrule = () => {
    if (form.recovery_rule?.length > 9) return;
    form.recovery_rule.push({
        beyond_days: '', //超过多少天
        beyond_hours: '', //超过多少小时
        not_do_type: '' //未进行某些操作  1新增线索 2修改线索信息
    });
};

//搜索部门
const searchName = () => {
    const params = {
        keyword: companySearch.value
    };
    dataTree.value = [];
    searchTreeList(params).then((data: any) => {
        if (data.length > 0) {
            dataTree.value = data;
        }
    });
};

const clickSearch = (data: any) => {
    nodeClick(data);
};

// const searchName = () => {
//   const params = {
//     keyword: companySearch.value
//   }
//   searchTreeList(params).then((data: any) => {
//     if (departVisible.value) {
//       dataTree.value = data.length > 0 ? data : []
//     } else {
//       searchTree.value = data.length > 0 ? data : []
//     }
//   })
// }

// 新建保存
const save = () => {
    if (!form.name) {
        ElMessage.warning('公海名称不能为空');
        return;
    }
    if (!form.admin_ids.length) {
        ElMessage.warning('管理员不能为空');
        return;
    }
    if (!form.dept_ids.length) {
        ElMessage.warning('可见部门不能为空');
        return;
    }
    if (form.apply_rule_type == 1 && form.is_limit == 2) {
        if (form.receive_qty.per_day == '' && form.receive_qty.per_month == '' && form.receive_qty.total == '') {
            ElMessage.warning('请填写领取数量');
            return;
        }
    }
    if (form.recovery_type == 2 && !form.recovery_ids.length) {
        ElMessage.warning('请选择指定员工');
        return;
    }
    if (form.is_recovery == 2) {
        if (form.recovery_seas_type == 2 && !form.recovery_seas_ids) {
            ElMessage.warning('请选择其他公海');
            return;
        }
        if (!form.recovery_rule.length) {
            ElMessage.warning('请添加回收规则');
            return;
        } else {
            const flag = form.recovery_rule.some(
                (ite: any): boolean => (!ite?.beyond_days && !ite?.beyond_hours) || !ite?.not_do_type
            );
            if (flag) {
                ElMessage.warning('请完善回收规则');
                return;
            }
        }
        if (form.recovery_remind && !form.recovery_remind_before_time) {
            ElMessage.warning('请完善回收提醒时间');
            return;
        }
    }
    //分配方式的切换数据修改
    if (form.apply_rule_type == 1) {
        form.auto_apply_type = '';
    } else if (form.apply_rule_type == 2) {
        form.is_limit = '';
        Object.keys(form.receive_qty).map((key, item) => {
            form.receive_qty[key] = '';
        });
    } else {
        form.auto_apply_type = '';
        form.is_limit = '';
        Object.keys(form.receive_qty).map((key, item) => {
            form.receive_qty[key] = '';
        });
    }
    //回收方式数据修改
    if (form.is_recovery == 1) {
        form.recovery_seas_type = '';
        form.recovery_seas_id = '';
        form.recovery_seas_ids = '';
        form.recovery_rule = [];
        form.recovery_type = '';
        form.recovery_remind = '';
        form.recovery_remind_before = '';
        form.recovery_remind_before_time = '';
    } else if (form.is_recovery == 2) {
        if (form.recovery_seas_type == 1) {
            form.recovery_seas_id = 0;
            form.recovery_seas_ids = '';
        } else if (form.recovery_seas_type == 2) {
            form.recovery_seas_id = form.recovery_seas_ids;
        }
        if (form.recovery_type == 1) {
            twocreators.value = [];
            form.recovery_ids = [];
        }
    }
    // 员工回检数据修改
    if (!form.staff_check) {
        form.staff_check_delay = '';
    }
    const { recovery_remind_before_time } = form;
    form.recovery_remind_before_time = recovery_remind_before_time?.substr(0, 5);
    const params = lodash.cloneDeep(form);
    params.recovery_remind = form.recovery_remind ? 1 : 2;
    params.staff_check = form.staff_check ? 1 : 2;
    if (router.currentRoute.value.query.id) {
        params.id = router.currentRoute.value.query.id;
        editCustomerSea(params).then(res => {
            ElMessage.success('编辑成功');
            router.go(-1);
        });
    } else {
        addCustomerSea(params).then(res => {
            ElMessage.success('新建成功');
            router.go(-1);
        });
    }
};

const changeClub = (data: any) => {
    if (data == 1) {
        form.recovery_seas_id = '';
        form.recovery_seas_ids = '';
    }
};
</script>
<style scoped lang="scss">
.newCommonList {
    background: #fff;
    padding: 24px;

    .ruleText {
        color: #33302d;
        margin-right: 16px;
    }

    .transcontent {
        display: flex;

        .circle {
            width: 6px;
            height: 6px;
            border: 2px solid #ff6b00;
            border-radius: 6px;
        }

        :deep .el-checkbox {
            display: block;
        }

        .transrule {
            min-width: 400px;
            border: 1px solid #eaeaea;
            padding: 16px;
            margin-bottom: 16px;

            .transcolumn {
                .transall {
                    display: flex;
                    align-items: center;

                    .right {
                        padding-left: 16px;

                        .tramsimg {
                            margin-left: 20px;
                        }
                    }

                    .left {
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                    }
                }

                .center {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    width: 10px;
                    margin-top: -10px;

                    .text {
                        color: #ff6b00;
                    }

                    .line {
                        height: 24px;
                        width: 0;
                        border: 1px dashed #ffc69e;
                    }
                }
            }
        }
    }

    :deep span.el-tag.el-tag--light.staffs_item::before {
        content: '';
        display: inline-block;
        width: 10px;
        height: 11px;
        background: url('@/assets/image/LiveCode/people_icon.png') center/100% no-repeat;
        margin-right: 10px;
    }

    .staffs_item {
        margin-right: 10px;
    }

    .radioContent .el-radio {
        display: block;
    }

    .btn {
        display: flex;
        justify-content: center;
    }

    .space {
        margin-bottom: 16px;

        .el-input {
            width: 160px;
        }
    }
}

.el-dialog {
    .el-dialog__body {
        .depart-content {
            display: flex;

            .el-tree-node__content {
                height: 35px !important;
            }

            .hover-text {
                width: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center;

                .hover-detail {
                    color: #535456;
                    font-size: 14px;
                }

                .hover-detail-color {
                    color: #ff6b00;
                }

                .hover-detail:hover {
                    color: #ff6b00;
                }

                .hover-icon {
                    transform: rotate(90deg);
                }
            }

            .search-list {
                display: flex;
                flex-direction: column;

                .search-detail {
                    margin: 0;
                    color: #33302d;
                }

                .search-detail:hover {
                    background-color: #f5f7fa;
                }

                .hover-text {
                    line-height: 35px;
                }
            }

            .no-data {
                display: flex;
                flex-direction: column;
                align-items: center;

                .nodata-img {
                    margin: 30px 0 30px 15px;
                    width: 150px;
                    height: 120px;
                }
            }

            .depart_r {
                padding: 10px 20px;
                flex: 1;

                .depart_select_title {
                    margin-bottom: 20px;
                }

                .seled_member {
                    line-height: 30px;
                    display: flex;
                    font-size: 14px;
                    padding: 0 5px;
                    align-items: center;
                    justify-content: space-between;

                    &:hover {
                        background-color: rgb(255 107 0 / 9.02%);
                    }

                    .item_member {
                        display: flex;
                        align-items: center;

                        .seled_icon {
                            color: #ff6b00;
                        }
                    }

                    .member_name {
                        margin-left: 2px;
                    }

                    .remove_icon {
                        cursor: pointer;

                        &:hover {
                            transform: scale(1.23);
                        }
                    }
                }
            }

            .depart_l {
                border-right: 1px solid #eee;
                padding-right: 16px;
                width: 320px;

                .search {
                    margin-bottom: 10px;
                }
            }

            .no-img {
                text-align: center;
            }

            .select-detail {
                width: 40%;
                display: flex;
                justify-content: space-between;
                line-height: 30px;
            }

            .select-details {
                width: 150px;
            }

            .depart-detail {
                display: flex;
                flex-direction: column;

                .search-detail {
                    color: #33302d;
                }

                .depart-btn {
                    margin: 0;
                }
            }
        }
    }
}
</style>

<style lang="scss">
.dialogClass {
    .el-dialog__body {
        padding: 10px 30px;
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }
}
</style>
